<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"DTD/xhtml1-strict.dtd">
<html>
  <head>
  </head>
<body>  
  <div class="upload">
    <h1>XML Data to Docx</h1>
    <label class="valid" for="upload_form">3 Files to upload</label>
    <%= form_tag({:action => "uploadfile"}, {:id=>"upload_form",:name=>"upload_form",:multipart=> true}) %>
    <p><label for="upload_file">Select XSLT</label> :
    <%= file_field 'upload', 'file' %>
    <label class="extension" for="upload_file">.xslt file required</label></p>
    <p><label for="upload_file1">Select Doc</label> :
    <%= file_field 'upload1', 'file1' %>
    <label class="extension" for="upload_file">.docx file required</label></p>
    <p><label for="upload_file2">Select XML</label> :
    <%= file_field 'upload2', 'file2' %>
    <label class="extension" for="upload_file">.xml file required</label></p>
    <%= submit_tag "Translate", :class => "submit" %>
    <%= form_tag %>
  </div>
  <style type="text/css">

    body {
      background-color:gray;
      font-family: tahoma, verdana, sans-serif;
      font-size:11px;
      margin-top:100px;
    }

    h1 {
      font-size:1.3em;
      padding-left:50px;
    }

    #upload_file, #upload1_file1, #upload2_file2 {
      margin-left:20px;
    }
    .upload{
      margin:0px auto;
      padding-top:15px;
      width:500px;
      height:225px;
      border:4px solid silver;
      background-color: #CCC;
      display:none;
    }

    form {
      padding-left:50px;
      padding-right:20px;
      padding-top:15px;
    }

    input {
      font-size:11px;
      font-family: tahoma, verdana, sans-serif;
    }

    .submit {
      margin-top:10px;
    }

    .valid, .extension {
      color:#157f1a;
    }

    .valid {
      padding-left:50px;
    }

    p {
      margin-top:8px;
      margin-bottom:8px;
    }

  </style>
  <script type="text/javascript" src="/javascripts/jquery.1.3.2.min.js"></script>
  <script type="text/javascript">
    $(document).ready(
      function() {
        $('.upload').fadeIn();
      }
    );
    </script>
</body>
</html>
